import React, { useMemo } from 'react';
import { Cascader } from 'antd';

interface IProps {
  value: string[];
  onChange(value: any[]): void;
  isSelectCounty?: boolean; // 是否可选择县区一级
}

interface Locale {
  code: string;
  value: string;
  label: string;
  children: Locale[]
}

function removeCounty(data: Locale[]) {
  data.forEach((province) => {
    province.children.forEach(city => {
      (city.children as any) = null
    })
  })
  return data
}

export default ({ value, onChange, isSelectCounty }: IProps) => {

  const options = useMemo(() => {
    const data: any[] = [];
    const pca = require('./pca.json');

    for (let provinceName in pca) {
      const province: any = { label: provinceName, value: provinceName, children: [] };
      for (let cityName in pca[provinceName]) {
        const city: any = { label: cityName, value: cityName };
        province.children.push(city);
        if (isSelectCounty) {
          pca[provinceName][cityName].forEach((regionName: string) => {
            const region = { label: regionName, value: regionName };
            if(!city.children) city.children = [];
            city.children.push(region)
          })
        }
      }
      data.push(province)
    }
    return data
  }, [isSelectCounty]);

  return (
    <Cascader value={value} options={options} onChange={onChange} />
  )
}